import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Select, Button, Table, Input, Image, message } from "antd";
import {
  PlusOutlined,
  EditOutlined,
  DeleteOutlined,
  SearchOutlined,
} from "@ant-design/icons";
import { text_check, post_axios, show_img_url } from "../../utils";
import "./index.scss";

export default function VisionpayGoodsOfficial(props) {
  const { t } = useTranslation();
  const [tableHeight, setTableHeight] = useState(0);
  const { actions, setSpinning } = props;
  let { menu_action, user_power_lang, username, user_grade } = actions;
  user_power_lang = JSON.parse(user_power_lang);

  // 国内国外判断
  const session_company = sessionStorage.getItem("company");
  let localStorage_company = JSON.parse(localStorage.getItem("choose_company"));
  const local_company_object =
    localStorage_company &&
    localStorage_company[username] &&
    localStorage_company[username]
      ? localStorage_company[username]
      : "";

  const pay_type = [
    {
      key: 41,
      text: "支付宝",
    },
    {
      key: 42,
      text: "微信",
    },
  ];
  const [order_sync_out_trade_no, setOrder_sync_out_trade_no] = useState("");
  const [order_sync_pay_type, setOrder_sync_pay_type] = useState(41);
  const order_sync_confirm = async () => {
    let upMsg = {
      out_trade_no: order_sync_out_trade_no,
      pay_type: order_sync_pay_type,
    };
    let res = await post_axios("vision_manager", "m_order_sync", upMsg);
    if (!res) return;
    message.success({
      content: t("common.successfully"),
    });
  };

  const [user_unsign_out_trade_no, setUser_unsign_out_trade_no] = useState("");
  const [user_unsign_pay_type, setUser_unsign_pay_type] = useState(41);
  const [user_agreement_no, setUser_agreement_no] = useState("");
  const user_unsign_confirm = async () => {
    let upMsg = {
      user_id: user_unsign_out_trade_no,
      pay_type: user_unsign_pay_type,
      agreement_no: user_agreement_no,
    };
    let res = await post_axios("vision_manager", "m_user_unsign", upMsg);
    if (!res) return;
    message.success({
      content: t("common.successfully"),
    });
  };
  return (
    <div className="vision_manager modules">
      <div className="main_model">
        <h3>同步已扣款订单</h3>
        <div className="ipt_box ipt_box_long">
          <div className="ipt_box_title">商户订单号</div>
          <Input
            placeholder=" "
            value={order_sync_out_trade_no}
            onChange={(e) => setOrder_sync_out_trade_no(e.target.value)}
          />
        </div>
        <div className="ipt_box ipt_box_long">
          <div className="ipt_box_title">支付方式</div>
          <Select
            placeholder=" "
            options={pay_type}
            value={order_sync_pay_type}
            fieldNames={{
              label: "text",
              value: "key",
            }}
            onChange={(value) => setOrder_sync_pay_type(value)}
          />
        </div>
        <Button onClick={order_sync_confirm}> 提交 </Button>
      </div>
      <div className="main_model">
        <h3>解约</h3>
        <div className="ipt_box ipt_box_long">
          <div className="ipt_box_title">用户id</div>
          <Input
            placeholder=" "
            value={user_unsign_out_trade_no}
            onChange={(e) => setUser_unsign_out_trade_no(e.target.value)}
          />
        </div>
        <div className="ipt_box ipt_box_long">
          <div className="ipt_box_title">协议号</div>
          <Input
            placeholder=" "
            value={user_agreement_no}
            onChange={(e) => setUser_agreement_no(e.target.value)}
          />
        </div>
        <div className="ipt_box ipt_box_long">
          <div className="ipt_box_title">支付方式</div>
          <Select
            placeholder=" "
            options={pay_type}
            value={user_unsign_pay_type}
            fieldNames={{
              label: "text",
              value: "key",
            }}
            onChange={(value) => setUser_unsign_pay_type(value)}
          />
        </div>
        <Button onClick={user_unsign_confirm}> 提交 </Button>
      </div>
    </div>
  );
}
